@using Limestone
@model Limestone.MVC.DesignedTemplate
@{
    Layout = "~/areas/limestone/views/shared/_layout.cshtml";
}
<script>
    $(function () {
        $('form button[data-action]').click(function () {
            this.form.action = $(this).data('action');
        });
    });
</script>
<div class="template-editor">
    <h1>
        Template Designer</h1>
    @using (Html.BeginForm("Design", "TemplateDesigner", FormMethod.Post, new { Class = "form-horizontal" }))
    {
        <fieldset>
            <legend>Properties</legend>
            @Html.LabelFor(t => t.Name, "Name", new { Class = "control-label" })
            @Html.EditorFor(f => f.Name)
            <span class="help-block">The name must be the same as the name of your view, excluding
                the file extension</span>
            @Html.LabelFor(t => t.HelpText, "Help text", new { Class = "control-label" })
            @Html.EditorFor(f => f.HelpText)
            <span class="help-block">This text will display when selecting and editing templates</span>
            <button type="submit" class="btn" data-action="@Url.Action("Save")">
                Save</button>
        </fieldset>
        
        <fieldset>
            <legend>Fields</legend>
            @foreach (var fldSet in Model.FieldSettings)
            {
                    <label class="control-label">@fldSet.Title (@fldSet.Type)</label>
                    @Html.EditorFor(p => p.FieldSettings[fldSet.Name])
            }
        </fieldset>
    
        @Html.TextBoxFor(f => f.NewFieldName)
        @Html.DropDownListFor(f => f.NewFieldType, new SelectList(Enum.GetValues(typeof(FieldType))))
        <button type="submit" class="btn" data-action="@Url.Action("Design")">
            Add</button>
    }
</div>
